<?php $collection = $this->_getCollection(); ?>
<?php if (count($collection) > 0) : ?>
<div class="banner-image">
	<div class="arrow-left">
		<a id="banner-left" href="#"><img src="<?php echo $this->getSkinUrl('images/arrow-left.jpg') ?>" alt=""></a>
	</div>
	<div class="banner" style="height:244px;">
		<?php foreach ($collection as $item) : ?>
			<?php $_imageList = $item->getImageList(); ?>
			<?php if (is_array($_imageList) and sizeof($_imageList) > 0) : ?>
				<?php foreach ($_imageList as &$_item) : ?>
					<a href="<?php echo $_item['label']; ?>" target="_blank">
						<img src="<?php echo $this->helper('gtbanner/image')->init($_item['file'])->constrainOnly(TRUE)->keepAspectRatio(FALSE)->keepFrame(TRUE)->resize(884,224); ?>" />				
					</a>
				<?php endforeach; ?>
			<?php endif; ?>
		<?php endforeach; ?>
	</div>
	<div class="arrow-right">
		<a id="banner-right" href="#"><img src="<?php echo $this->getSkinUrl('images/arrow-right.jpg') ?>" alt=""></a>
	</div>
</div>
<script type="text/javascript">
	jQuery(document).ready(function() {
		jQuery('.banner').cycle({
			fx: 'fade',
			prev: '#banner-left',
			next: '#banner-right'
		});
	}); 
</script>
<?php endif; ?>